<template>
  <ContainerGroup>
    <Container height="fill" display="flexY">
      <div class="time-process">
        <div class="timeBtn-box">
          <span>时间:</span>
          <el-date-picker
            v-model="timeMonth"
            size="mini"
            type="month"
            value-format="yyyy-MM"
            placeholder="选择月"
            class="time-self"
          />
          <Button icon="reset" :loading="cjLoading" @click="handleCollection">采集数据</Button>
        </div>
        <div class="process-box">
          <div class="process-item">
            <img src="../../assets/image/kscj.png" width="100%" height="100%" alt>
          </div>
          <div class="process-item-jt">
            <img src="../../assets/image/jt.png" width="100%" height="100%" alt>
          </div>
          <div class="process-item">
            <img src="../../assets/image/xmsb.png" width="100%" height="100%" alt>
          </div>
          <div class="process-item-jt">
            <img src="../../assets/image/jt.png" width="100%" height="100%" alt>
          </div>
          <div class="process-item">
            <img src="../../assets/image/szmxcj.png" width="100%" height="100%" alt>
          </div>
          <div class="process-item-jt">
            <img src="../../assets/image/jt.png" width="100%" height="100%" alt>
          </div>
          <div class="process-item">
            <img src="../../assets/image/wccj.png" width="100%" height="100%" alt>
          </div>
        </div>
      </div>
    </Container>
  </ContainerGroup>
</template>
<script>
import { gatherDeptDirectorInfo } from '@/apis/kzrFound'
export default {
  name: 'DataAcquisition', // 数据采集
  data() {
    return {
      timeMonth: this.$util.currentDate(0),
      cjLoading: false
    }
  },
  created() {},
  methods: {
    handleCollection() {
      this.cjLoading = true
      var params = {
        dateTime: this.timeMonth + '-01'
      }
      gatherDeptDirectorInfo(params).then(res => {
        this.cjLoading = false
        if (res.data.code === 200) {
          this.$message.success(res.data.data)
        } else {
          this.$message.error('采集失败')
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>
.time-process {
  width: 75%;
  margin: 10% auto;
  .timeBtn-box {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin-bottom: 140px;
    .time-self {
      margin-left: 5px;
      margin-right: 15px;
    }
  }
  .process-box {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    .process-item {
      width: 80px;
      height: 80px;
    }
    .process-item-jt {
      width: 42px;
      height: 43px;
    }
  }
}
</style>
